 
<template>
    <div style="height:100%;" class="padding10">
        <Row class="divBar">
            <!--搜索框-->
                <Col span="14">
                   <label  v-show="userInfo.AreaCode=='530000000000'">所属地区:</label>
                    <Select v-model="searchModel.AreaCode" placeholder="全部" :label-in-value="true" @on-change="GetData()" style="width:120px" v-show="userInfo.AreaCode=='530000000000'">
                        <Option :value="item.value" v-for="item in AreaList" :key="item.value">{{item.label}}</Option>
                    </Select>
                    <span v-show="!lineShow">填报年度:</span>
                    <Select v-model="searchModel.FillInYear" placeholder="全部" :label-in-value="true" @on-change="GetData()" v-show="!lineShow" style="width:120px">
                        <Option :value="item.DictValue" v-for="item in CreateYearList" :key="item.DictValue">{{item.DictText}}</Option>
                    </Select>
                    <Button  type="primary" v-show="listShow" @click="Download()">导出列表</Button> 
                </Col>                      
                <Col :span="(lineShow&&userInfo.AreaCode!='530000000000')?24:10" style="text-align:right;">    
                    <RadioGroup v-model="currentButton" @on-change="changeButton" type="button"  size="large">
                        <Radio label="listShow" title="列表"><Icon type="ios-paper" size="35"></Icon></Radio>                            
                        <Radio label="pieShow" title="饼图"><Icon type="ios-pie" size="35"></Icon></Radio>                            
                        <Radio label="lineShow" title="折线图"><Icon type="ios-pulse" size="35"></Icon></Radio>
                        <Radio label="mapShow" title="地图"><Icon type="android-map" size="35"></Icon></Radio>                            
                    </RadioGroup>                    
                </Col>                              
            </Row>
            <Row  v-show="listShow">
            <!-- 列表-->
            <div class="col-margin">
                <!-- <div :style="{overflow:'auto',height:clientHeight+'px'}">
                <table class="statisTable" :style="tableStyle" v-show="!isCounty">
                    <thead>
                        <tr>
                            <th rowspan="4">地区</th>
                            <th style="background:#ebf7ff" colspan="10">销售情况</th>
                            <th style="background:#f9c912" colspan="2">存储情况</th>
                            <th style="background:#ebf7ff" colspan="6">加工情况</th>
                        </tr>
                        <tr>
                            <th rowspan="3">全年生产总量(万吨）</th>
                            <th colspan="2">其中外销量（出县）</th>                                                                                                                                                                                                  
                            <th colspan="4">自留（万吨）</th>                                                                                   
                            <th rowspan="3">全年生产总产值（万元）</th>
                            <th colspan="2">其中外销产值（出县）</th>
                            <th rowspan="3">存储量（万吨）</th>
                            <th rowspan="3">库存（万吨）</th> 
                            <th colspan="2">精淀粉</th>
                            <th colspan="2">薯片</th> 
                            <th colspan="2">其他</th>                                                                                       
                        </tr>
                        <tr>                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    
                            <th rowspan="2">外销量（万吨）</th>
                            <th rowspan="2">比上年增减%</th>
                            <th rowspan="2">自留总量</th>
                            <th colspan="3">其中</th>
                            <th rowspan="2">外销产值（万元）</th>
                            <th rowspan="2">比上年增减%</th>  
                            <th rowspan="2">加工量（万吨）</th>
                            <th rowspan="2">产值（万元）</th>
                            <th rowspan="2">加工量（万吨）</th>
                            <th rowspan="2">产值（万元）</th>
                            <th rowspan="2">加工量（万吨）</th>
                            <th rowspan="2">产值（万元）</th>                                  
                        </tr>
                        <tr>
                            <th>鲜食</th>
                            <th>饲用</th>
                            <th>种薯</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr v-for="(dataModel,index) in dataList" :key="index" :style="rowStyle(index,dataList.length)">
                            <td style="text-align:center">{{dataModel.AreaName}}</td>
                            <td>
                                {{dataModel.ProductYield}}                            
                            </td>
                            <td>
                                {{dataModel.SaleYield}}
                            </td>
                            <td>
                                {{dataModel.PecSaleYield}}
                            </td>
                            <td>
                                {{dataModel.ZLyield}}
                            </td>
                            <td>
                                {{dataModel.XSyield}}
                            </td>
                            <td>
                                {{dataModel.SYyield}}
                            </td>
                            <td>
                                {{dataModel.ZSyield}}
                            </td>
                            <td>
                                {{dataModel.ProductOutput}}
                            </td>
                            <td>
                                {{dataModel.SaleOutput}}
                            </td>
                            <td>
                                {{dataModel.PecSaleOutput}}
                            </td>
                            <td>
                                {{dataModel.StorageNum}}
                            </td>
                            <td>
                                {{dataModel.Stock}}
                            </td>
                            <td>
                                {{dataModel.DFyield}}
                            </td>
                            <td>
                                {{dataModel.DFoutput}}
                            </td>
                            <td>
                                {{dataModel.SPyield}}
                            </td>
                            <td>
                                {{dataModel.SPoutput}}
                            </td> 
                            <td>
                                {{dataModel.OPyield}}
                            </td>
                            <td>
                                {{dataModel.OPoutput}}
                            </td>                
                        </tr>
                    </tbody>
                </table>
                <table class="statisTable" :style="tableStyle" v-show="isCounty">
                    <thead>
                        <tr>
                            <th style="background:#ebf7ff" colspan="11">销售情况</th>
                            <th style="background:#f9c912" colspan="3">存储情况</th>
                            <th style="background:#ebf7ff" colspan="6">加工情况</th>
                            <th style="background:#f9c912" rowspan="4">备注</th>
                        </tr>
                        <tr>
                            <th rowspan="3">全年生产总量(万吨）</th>
                            <th colspan="2">其中外销量（出县）</th>                                                                                                                                                                                                  
                            <th colspan="4">自留（万吨）</th>                                                                                   
                            <th rowspan="3">全年生产总产值（万元）</th>
                            <th colspan="2">其中外销产值（出县）</th>                                                                                                           
                            <th rowspan="3">销售区域</th>  
                            <th rowspan="3">存储量（万吨）</th>
                            <th rowspan="3">存储方式</th>
                            <th rowspan="3">库存（万吨）</th> 
                            <th colspan="2">精淀粉</th>
                            <th colspan="2">薯片</th> 
                            <th colspan="2">其他</th>                                                                                        
                        </tr>
                        <tr>                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                    
                            <th rowspan="2">外销量（万吨）</th>
                            <th rowspan="2">比上年增减%</th>
                            <th rowspan="2">自留总量</th>
                            <th colspan="3">其中</th>
                            <th rowspan="2">外销产值（万元）</th>
                            <th rowspan="2">比上年增减%</th>
                            <th rowspan="2">加工量（万吨）</th>
                            <th rowspan="2">产值（万元）</th>
                            <th rowspan="2">加工量（万吨）</th>
                            <th rowspan="2">产值（万元）</th>
                            <th rowspan="2">加工量（万吨）</th>
                            <th rowspan="2">产值（万元）</th>                                    
                        </tr>
                        <tr>
                            <th>鲜食</th>
                            <th>饲用</th>
                            <th>种薯</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>
                                {{cdataModel.ProductYield}}                            
                            </td>
                            <td>
                                {{cdataModel.SaleYield}}
                            </td>
                            <td>
                                {{cdataModel.PecSaleYield}}
                            </td>
                            <td>
                                {{cdataModel.ZLyield}}
                            </td>
                            <td>
                                {{cdataModel.XSyield}}
                            </td>
                            <td>
                                {{cdataModel.SYyield}}
                            </td>
                            <td>
                                {{cdataModel.ZSyield}}
                            </td>
                            <td>
                                {{cdataModel.ProductOutput}}
                            </td>
                            <td>
                                {{cdataModel.SaleOutput}}
                            </td>
                            <td>
                                {{cdataModel.PecSaleOutput}}
                            </td>
                            <td>
                                {{cdataModel.SaleZone}}
                            </td>
                            <td>
                                {{cdataModel.StorageNum}}
                            </td>
                            <td>
                                {{cdataModel.StorageWay}}
                            </td>
                            <td>
                                {{cdataModel.Stock}}
                            </td>
                            <td>
                                {{cdataModel.DFyield}}
                            </td>
                            <td>
                                {{cdataModel.DFoutput}}
                            </td>
                            <td>
                                {{cdataModel.SPyield}}
                            </td>
                            <td>
                                {{cdataModel.SPoutput}}
                            </td> 
                            <td>
                                {{cdataModel.OPyield}}
                            </td>
                            <td>
                                {{cdataModel.OPoutput}}
                            </td>                            
                            <td>
                                {{cdataModel.Remark}}
                            </td>
                        </tr>
                    </tbody>
                </table>
                </div> -->
                <Table  :columns="columnList" width="100%" no-data-text="暂无数据....." :data="dataList" border :height="clientHeight"></Table>
            </div>
         </Row>
        <Row v-show="pieShow" style="border:1px solid #D7DDE4;">
            <!--饼图-->
            <div  id="divPie"></div>
        </Row>
        <Row v-show="lineShow" style="border:1px solid #D7DDE4;overflow:auto">
            <!--折线图-->
            <div style="border:1px solid #D7DDE4;padding:10px;margin:5px" >
                <!-- <span style="font-size:18px">指标集合：</span> -->
            <RadioGroup v-model="propIndex" @on-change="showLine()">
                <Radio :label="index" v-for="(item,index) in PropNameList" :key="index">{{item}}</Radio>
            </RadioGroup>
            </div>
            <div  id="divLine" style="width:1200px;height:670px;"></div>
        </Row>
        <Row  v-show="mapShow">
            <!--地图展示-->
            <Tabs type="card">
                <TabPane label="销售情况">
                    <div id="divMapOne" style="border:1px solid #D7DDE4;"></div>
                </TabPane>
                <TabPane label="存储情况">
                    <div id="divMapTwo" style="border:1px solid #D7DDE4;"></div>
                </TabPane>
                <TabPane label="加工情况">
                    <div id="divMapThree" style="border:1px solid #D7DDE4;"></div>
                </TabPane>
            </Tabs>
        </Row>
    </div>
</template>
<script>
export default {
    data() {
        return {
            isCounty:false,
            cdataModel:'',//区县级的数据对象
            showType:false,
            detailList:[],//详情页列表对象
            currentButton:'listShow',
            listShow:true,//列表显示控制器
            lineShow:false,//折线图显示控制器
            mapShow:false,//地图显示控制器 
            pieShow:false,//饼图显示控制器 
            userInfo: '',
            AreaList: [],//所属行政区划数组,
            TableCodeList: this.GetGroupDict("ReportTableName"),//表名称
            CreateYearList: this.GetGroupDict("ReportYear"),
            tableStyle:{
                //height:window.innerHeight - 173+'px',
                //marginBottom:'50px',
                width:'1900px'
            },
            DataModel: {//编辑模型
                Id: 0,
                ReportId: '',
                
            },
            //查询模型：根据需求删除不不要查询条件
            searchModel: {
                ReportCode: 'PotSaleStorege',
                FillInYear: new Date().getFullYear()+"",
                TimesType: '',
                AreaCode: this.GetlocaStorage("potUserinfo").AreaCode,
                Status:'',
                PageNumber: 1, PageSize: 20
            },
            dataList:[],
            columnList:[
                {title:'地区',key:'AreaName',align:'center',fixed:'left',width:180},
                {title:'销售情况',align:'center',children:[
                    {title:'全年生产总量（万吨）',key:'ProductYield',align:'right',width:120,sortable: true},
                    {title:'其中外销量（出县）',align:'center',children:[
                        {title:'外销量（万吨）',key:'SaleYield',align:'right',width:120,sortable: true},
                        {title:'比上年增减%',key:'PecSaleYield',align:'right',width:120,sortable: true},
                    ]},
                    {title:'自留（万吨）',align:'center',children:[
                        {title:'自留总量',key:'ZLyield',align:'right',width:120,sortable: true},
                        {title:'其中',align:'center',children:[
                            {title:'鲜食',key:'XSyield',align:'right',width:120,sortable: true},
                            {title:'饲用',key:'SYYield',align:'right',width:120,sortable: true},
                            {title:'种薯',key:'ZSyield',align:'right',width:120,sortable: true},
                        ]}
                    ]},
                    {title:'全年生产总产值（万元）',key:'ProductOutput',align:'right',width:120,sortable: true},
                    {title:'其中外销产值（出县）',align:'center',children:[
                        {title:'外销产值（万元）',key:'SaleOutput',align:'right',width:120,sortable: true},
                        {title:'比上年增减%',key:'PecSaleOutput',align:'right',width:120,sortable: true},
                    ]},
                    // {title:'销售区域',key:'SaleZone',align:'center',width:120},
                ]},
                {title:'存储情况',align:'center',children:[
                    {title:'存储量（万吨）',key:'StorageNum',align:'right',width:120,sortable: true},
                    // {title:'存储方式',key:'StorageWay',align:'right',width:120},
                    {title:'库存（万吨）',key:'Stock',align:'right',width:120,sortable: true},
                ]},
                {title:'加工情况',align:'center',children:[
                    {title:'精淀粉',align:'center',children:[
                        {title:'加工量（万吨）',key:'DFyield',align:'right',width:120,sortable: true},
                        {title:'产值（万元）',key:'DFoutput',align:'right',width:120,sortable: true},
                    ]},
                    {title:'薯片',align:'center',children:[
                        {title:'加工量（万吨）',key:'SPyield',align:'right',width:120,sortable: true},
                        {title:'产值（万元）',key:'SPoutput',align:'right',width:120,sortable: true},
                    ]},
                    {title:'其他',align:'center',children:[
                        {title:'加工量（万吨）',key:'OPyield',align:'right',width:120,sortable: true},
                        {title:'产值（万元）',key:'OPoutput',align:'right',width:120,sortable: true},
                    ]},
                ]},
                // {title:'备注',key:'Remark',align:'center',fixed:'right',width:120},
            ],
            CurrentAreaName:'',
            mapType:'',
            echartsItem0:['全年生产总量（万吨）','外销量（万吨）','自留总量','鲜食','饲用','种薯','全年生产总产值（万元）','外销产值（万元）'],
            echartsItem1:['存储量（万吨）','库存（万吨）'],
            echartsItem2:['精淀粉加工量（万吨） ','精淀粉产值（万元）','薯片加工量（万吨） ','薯片产值（万元）','其他加工量（万吨） ','其他产值（万元）'],
            GeoData:'',
            //地图数据
            //销售情况
            MapProductYieldData:[],
            MapSaleYieldData:[],
            MapZLyieldData:[],
            MapSYYieldData:[],
            MapXSyieldData:[],
            MapZSyieldData:[],
            MapProductOutputData:[],
            MapSaleOutputData:[],
            //存储情况
            MapStorageNumData:[],
            MapStockData:[],
            //加工情况
            MapDFyieldData:[],
            MapDFoutputData:[],
            MapSPyieldData:[],
            MapSPoutputData:[],
            MapOPyieldData:[],
            MapOPoutputData:[],
            mapList0:[],
            mapList1:[],
            mapList2:[],
            //折线图数据
            PropDataList:[],
            propIndex:0,//指标索引
            PropNameList:['全年生产总量（万吨）','外销量（万吨） ','外销量增长率%','自留总量','鲜食','饲用 ','种薯 ','全年生产总产值（万元） ','外销产值（万元）','外销产值增长率',
            '存储量（万吨）','库存（万吨）','精淀粉加工量（万吨）','精淀粉产值（万元）','薯片加工量（万吨）','薯片产值（万元）','其他加工量（万吨）','其他产值（万元）'],//指标名称列表
            clientHeight: window.innerHeight - 179,//表格默认高度
            //饼图数据
            pieData:[],
        }
    },
    mounted() {
        //table高度计算方法
        const that = this;
        window.onresize = () => {
            return (() => {
                that.clientHeight = window.innerHeight - 179;
            })()
        };
    },
    methods: {
        SearchAreaList() {
            var areaCode = this.userInfo.AreaCode;
            var areaList=[];
            var templist = [];
            var areaEntity = new Object();
            areaEntity.value=areaCode;
            areaEntity.children=[];
            if (areaCode != '530000000000' && areaCode != null) {
                var item = this.GetlocaStorage("areatreelist")[0];
                areaEntity.label="全州（市）";
                for (var i = 0; i < item.children.length; i++) {
                    if (item.children[i].value == areaCode) {
                        areaList.push(item.children[i]);
                    }
                }
            } else {
                areaEntity.label="全省";
                areaList = this.GetlocaStorage("areatreelist");
            }
            templist.push(areaEntity);
             this.AreaList=templist.concat(areaList[0].children);
        },
        changeButton(n){
            if(n=="listShow")
            {
                this.listShow=true;//显示列表
                this.lineShow=false;
                this.mapShow=false;
                this.pieShow=false;
            }
            else if(n=="pieShow")
            {
                this.listShow=false;
                this.pieShow=true;//显示饼图
                this.lineShow=false;
                this.mapShow=false;
            }
            else if(n=="lineShow")
            {
                this.listShow=false;
                this.lineShow=true;//显示折线图
                this.mapShow=false;
                this.pieShow=false;
                this.showLine();
            }
             else if(n=="mapShow")
            {
                this.listShow=false;
                this.lineShow=false;//显示地图
                this.mapShow=true;
                this.pieShow=false;
                //  this.getStatsData();   //获取地区统计数据  
                //this.showMap();
            }
            else{
                 this.listShow=true;//默认显示列表
                 this.lineShow=false;
                 this.mapShow=false;
                 this.pieShow=false;
            }
        },
        getDetail(AreaCode){
          var self = this;
          this.$http.get("PotPromotion/GetStatisListData", {params: {AreaCode: AreaCode,FillInYear: this.searchModel.FillInYear}}).then(function(res) {
          if (res.data.status == 1) {
            self.detailList = res.data.model;
            self.showType = true;            
          } else {
            self.$Modal.error({ title: "提示信息", content: res.data.message });
          }
        });
        },
        Download(){
            if(this.isCounty){
                window.open(this.$http.defaults.baseURL +"PotSaleStorege/GetExcelData?FillInYear=" +this.searchModel.FillInYear +"&&AreaCode=" +this.searchModel.AreaCode);
            }
            else{
                window.open(this.$http.defaults.baseURL + "PotSaleStorege/GetStatisExcel?FillInYear="  + this.searchModel.FillInYear + "&&AreaCode=" + this.searchModel.AreaCode);
            }
          
        },
        GetData(){
          if(this.isCounty){
                this.getCountyListData();
            }else{
                this.getListData();
            }
        },
        rowStyle(index,length){  
            let striprow ={ backgroundColor: '#ebf7ff'};    
            if(index==(length-1)){       
                return {
                    backgroundColor: '#f9c912'
                }
            }
            else if(index%2 !=0){
                return striprow;
            }
             else{
               return 
           }
        },
        rowclass(item,index){
          let striprow ={
            backgroundColor: '#ebf7ff'
          }
          let cityrow = {
             backgroundColor: '#ff6600'
          }
          let provinrow = {
            backgroundColor: '#183'
          }
            if(index %2 ==0){
              if(item.tag==1){
                return cityrow
              }
              else if(item.tag==2){
                return provinrow
              }              
            }
            else{
              if(item.tag==1){
                return cityrow
              }
              else if(item.tag==2){
                return provinrow
              }
              else{
                return striprow
              }
            }
        },
        getListData(){
            var self = this;
             //判断当前用户是否为省级账号
            if(self.userInfo.AreaCode=="530000000000")
            {
                // self.isProvince=true;
                self.mapType=self.searchModel.AreaCode;
            }
            else{
                self.mapType=self.userInfo.AreaCode;
            }
            //地图数据
            //马铃薯市场
            self.MapProductYieldData=[],
            self.MapSaleYieldData=[],
            self.MapZLyieldData=[],
            self.MapSYYieldData=[],
            self.MapXSyieldData=[],
            self.MapZSyieldData=[],
            self.MapProductOutputData=[],
            self.MapSaleOutputData=[],
            //马铃薯企业
            self.MapStorageNumData=[],
            self.MapStockData=[],
            //马铃薯农民合作社
            self.MapDFyieldData=[],
            self.MapDFoutputData=[],
            self.MapSPyieldData=[],
            self.MapSPoutputData=[],
            self.MapOPyieldData=[],
            self.MapOPoutputData=[]
            
            self.mapList0=[],
            self.mapList1=[],
            self.mapList2=[],
            self.GeoData=self.GetGeoData(self.mapType); 

            self.pieData = [];
            this.$http.get('PotSaleStorege/GetStatisListData',{params: {AreaCode: this.searchModel.AreaCode,FillInYear: this.searchModel.FillInYear}}).then(function(res){
                if(res.data.status==1){
                    self.dataList = res.data.model;
                    self.CurrentAreaName=res.data.model[res.data.model.length-1].AreaName=="合计"?'云南省':res.data.model[res.data.model.length-1].AreaName;
                    for(var i=0;i<res.data.model.length-1;i++)
                    {
                    //地图数据
                    //销售情况
                    self.MapProductYieldData.push({'name':res.data.model[i].AreaName,'value':res.data.model[i].ProductYield});
                    self.MapSaleYieldData.push({'name':res.data.model[i].AreaName,'value':res.data.model[i].SaleYield});
                    self.MapZLyieldData.push({'name':res.data.model[i].AreaName,'value':res.data.model[i].ZLyield});
                    self.MapXSyieldData.push({'name':res.data.model[i].AreaName,'value':res.data.model[i].XSyield});
                    self.MapSYYieldData.push({'name':res.data.model[i].AreaName,'value':res.data.model[i].SYYield});
                    self.MapZSyieldData.push({'name':res.data.model[i].AreaName,'value':res.data.model[i].ZSyield});
                    self.MapProductOutputData.push({'name':res.data.model[i].AreaName,'value':res.data.model[i].ProductOutput});
                    self.MapSaleOutputData.push({'name':res.data.model[i].AreaName,'value':res.data.model[i].SaleOutput});
                    //存储情况
                    self.MapStorageNumData.push({'name':res.data.model[i].AreaName,'value':res.data.model[i].StorageNum});
                    self.MapStockData.push({'name':res.data.model[i].AreaName,'value':res.data.model[i].Stock});
                    //加工情况
                    self.MapDFyieldData.push({'name':res.data.model[i].AreaName,'value':res.data.model[i].DFyield});
                    self.MapDFoutputData.push({'name':res.data.model[i].AreaName,'value':res.data.model[i].DFoutput});
                    self.MapSPyieldData.push({'name':res.data.model[i].AreaName,'value':res.data.model[i].SPyield});
                    self.MapSPoutputData.push({'name':res.data.model[i].AreaName,'value':res.data.model[i].SPoutput});
                    self.MapOPyieldData.push({'name':res.data.model[i].AreaName,'value':res.data.model[i].OPyield});
                    self.MapOPoutputData.push({'name':res.data.model[i].AreaName,'value':res.data.model[i].OPoutput});
                    }
                    if(res.data.model.length>0){
                        let totalModel = res.data.model[res.data.model.length-1];
                        self.pieData.push({'name':'外销量','value':totalModel.SaleYield})
                        self.pieData.push({'name':'自留量','value':totalModel.ZLyield})
                        self.pieData.push({'name':'存储量','value':totalModel.StorageNum})
                        let jgYield = (0 + totalModel.DFyield+totalModel.SPyield+totalModel.OPyield).toFixed(2);
                        self.pieData.push({'name':'加工量','value':jgYield})
                        let qtYield = (totalModel.ProductYield-totalModel.SaleYield-totalModel.ZLyield-totalModel.StorageNum-jgYield).toFixed(2);
                        self.pieData.push({'name':'其他','value':qtYield})
                    }
                    //地图数据
                    self.mapList0.push(self.MapProductYieldData,self.MapSaleYieldData,self.MapZLyieldData,self.MapXSyieldData,self.MapSYYieldData,self.MapZSyieldData,self.MapProductOutputData,self.MapSaleOutputData);
                    self.mapList1.push(self.MapStorageNumData,self.MapStockData);
                    self.mapList2.push(self.MapDFyieldData,self.MapDFoutputData,self.MapSPyieldData,self.MapSPoutputData,self.MapOPyieldData,self.MapOPoutputData);
                    self.showMap();
                    self.showPie();
                }else{
                    self.$Modal.error({title:'提示信息',content:res.data.message});
                }
            })
        },
        showMap(){
            var self=this;
            var containerTable=document.getElementsByClassName('ivu-col ivu-col-span-4');
            //******************显示地图
            
            var containerMapOne=document.getElementById('divMapOne');
            var containerMapTwo=document.getElementById('divMapTwo');
            var containerMapThree=document.getElementById('divMapThree');
            // //用于使chart自适应高度和宽度,通过窗体高宽计算容器高宽
            var resizeContainerMap = function () {
                //containerTable[0].clientWidth 左侧菜单栏的宽度
                containerMapOne.style.width = (window.innerWidth- containerTable[0].clientWidth-22)+'px';
                containerMapOne.style.height = (window.innerHeight-280)+'px';
                containerMapTwo.style.width = (window.innerWidth- containerTable[0].clientWidth-22)+'px';
                containerMapTwo.style.height = (window.innerHeight-280)+'px';
                containerMapThree.style.width = (window.innerWidth- containerTable[0].clientWidth-22)+'px';
                containerMapThree.style.height = (window.innerHeight-280)+'px';
            };
            //设置容器高宽
            resizeContainerMap();

            var myMapOne = myEcharts.init(containerMapOne, 'shine');
            var myMapTwo = myEcharts.init(containerMapTwo, 'shine');
            var myMapThree = myEcharts.init(containerMapThree, 'shine');
            var MapNameOne=this.searchModel.FillInYear+'年(五)'+self.CurrentAreaName+'马铃薯销售、存储与加工情况统计表';
            var MapNameTwo=this.searchModel.FillInYear+'年(五)'+self.CurrentAreaName+'马铃薯销售、存储与加工情况统计表';
            var MapNameThree=this.searchModel.FillInYear+'年(五)'+self.CurrentAreaName+'马铃薯销售、存储与加工情况统计表';
            var optionMapOne = self.GetMapOption(MapNameOne,self.GeoData,self.mapType,self.echartsItem0,self.mapList0);
            var optionMapTwo = self.GetMapOption(MapNameTwo,self.GeoData,self.mapType,self.echartsItem1,self.mapList1);
            var optionMapThree = self.GetMapOption(MapNameThree,self.GeoData,self.mapType,self.echartsItem2,self.mapList2);
            myMapOne.setOption(optionMapOne);
            myMapTwo.setOption(optionMapTwo);
            myMapThree.setOption(optionMapThree);
            //用于使chart自适应高度和宽度
            window.onresize = function () {
                //重置容器高宽
                resizeContainerMap();
                myMapOne.resize();
                myMapTwo.resize();
                myMapThree.resize();
            };
        },
        // getCountyListData(){
        //     var self = this;
        //     this.$http.get('PotSaleStorege', {params:{AreaCode:this.searchModel.AreaCode,FillInYear:this.searchModel.FillInYear}}).then(function (res) {
        //         if (res.data.status == 1) {
        //            self.cdataModel = res.data.model.DataModel;
        //         }
        //         else {
        //             self.$Modal.error({ title: '提示信息', content: res.data.message });
        //         }
        //     });
        // },
        currentYear() {
           let year = new Date().getFullYear();
           let month = new Date().getMonth();
            if (month > 1) {
                this.searchModel.FillInYear = year.toString();
            } else {
               this.searchModel.FillInYear = (year - 1).toString();
              }
        },
        SearchCascaderChange() {
            if(this.searchModel.AreaCode.substr(4,2) !="00"){
                this.isCounty = true;
            }
            else{
                this.isCounty = false;
            }
            
            this.GetData();
        },
        getAllYearStatisList(){
            var self = this;
            this.$http.get('PotSaleStorege/GetAllYearStatisList',{params: this.searchModel}).then(function(res){
                if(res.data.status==1){
                    self.PropDataList = res.data.model;
                }
                else{
                    self.$Modal.error({title:'提示信息',content:res.data.message});
                }
            });
        },
        showLine(){
            var containerLine=document.getElementById('divLine');
            var containerTable=document.getElementsByClassName('ivu-col ivu-col-span-4');
            containerLine.style.width = (window.innerWidth- containerTable[0].clientWidth-42)+'px';
            containerLine.style.height = (window.innerHeight-320)+'px';
            var myChart = myEcharts.init(document.getElementById('divLine'), 'shine');
            var lineOption = this.getLineOption(this.PropDataList,this.propIndex,this.PropNameList[this.propIndex]);
            myChart.setOption(lineOption);
        },
        showPie(){
            var containerPie=document.getElementById('divPie');
            var containerTable=document.getElementsByClassName('ivu-col ivu-col-span-4');
            containerPie.style.width = (window.innerWidth- containerTable[0].clientWidth-42)+'px';
            containerPie.style.height = (window.innerHeight-320)+'px';
            var myChart = myEcharts.init(document.getElementById('divPie'), 'shine');
            var pieOption = {
                title:{show:true,text:this.CurrentAreaName+'马铃薯使用情况统计',left: 'center'},
                tooltip : {
                    // trigger: 'item',
                    formatter: "{b} : {c} ({d}%)"
                },
                series: [{
                    type: 'pie',
                    name:'',
                    radius: '55%',
                    center: ['50%', '60%'],
                    data:this.pieData
                }]
            };
            
            myChart.setOption(pieOption);
        },
        propChange(){
            this.showLine();
        },
        getData(){
            this.getListData();
            this.getAllYearStatisList();
        }
    },
    //创建Vue页面方法
    created: function () {
       // this.currentYear();
        this.userInfo = this.GetlocaStorage("potUserinfo");
        this.AreaList = this.getChildAreaList(this.userInfo.AreaCode);
        this.getData();
       
    },
    watch: {
        //需要监听的在此处新增监听对象
    }
}
</script>
